﻿<Page
    x:Class="LearnEnglishWords.UI.Views.WordDemostrationView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:LearnEnglishWords.UI.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:cal="using:Caliburn.Micro"    
    xmlns:Conv="using:LearnEnglishWords.UI.Converters"
    mc:Ignorable="d"
    Background="{StaticResource aBlue}">
    
    <Page.Resources>
        <Conv:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" TrueValue="Visible" FalseValue="Collapsed"/>

        <Conv:LanguageToObjectConverter x:Key="LanguageToBrushConverter" 
                                         TrueValue="{StaticResource aSpecialGreen}" 
                                         FalseValue="{StaticResource aLightGray}"/>

        <Conv:LanguageToObjectConverter x:Key="LanguageToCardConverter" 
                                         TrueValue="{Binding EnglishCard}" 
                                         FalseValue="{Binding RussianCard}"/>

        <Conv:LanguageToObjectConverter x:Key="LanguageToVisibilityConverter" 
                                         TrueValue="Visible" 
                                         FalseValue="Collapsed"/>



    </Page.Resources>

    <Grid>
        <Grid Visibility="{Binding IsKnownHitVisible,Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter=false}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="5*"/>
                <ColumnDefinition Width="5*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="10*"/>
                <RowDefinition Height="130"/>
            </Grid.RowDefinitions>

            <MediaElement x:Name="Media"/>

            <Grid Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" Tapped="TextBlock_Tapped">

                <ContentPresenter cal:View.Model="{Binding EnglishCard}" 
                              HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                              Visibility="{Binding SelectedLanguage, Converter={StaticResource LanguageToVisibilityConverter}, ConverterParameter={StaticResource EnglishLanguage}}"/>

                <ContentPresenter cal:View.Model="{Binding RussianCard}"
                              HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                              Visibility="{Binding SelectedLanguage, Converter={StaticResource LanguageToVisibilityConverter}, ConverterParameter={StaticResource RussianLanguage}}"/>

                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Top" FontSize="{StaticResource MiddleFontSize}" Margin="0, 30, 0, 0">
                <Run Text="EN" Foreground="{Binding SelectedLanguage, Converter={StaticResource LanguageToBrushConverter}, ConverterParameter={StaticResource EnglishLanguage}}" />
                <Run Text="RU" Foreground="{Binding SelectedLanguage, Converter={StaticResource LanguageToBrushConverter}, ConverterParameter={StaticResource RussianLanguage}}" />
                </TextBlock>
            </Grid>

            <Button FontSize="{StaticResource RegularFontSize}" 
                Content="KNOWN" 
                HorizontalAlignment="Stretch" 
                Background="{StaticResource aGray}" 
                Foreground="{StaticResource aWhite}" BorderThickness="0" Grid.Row="2" Click="OnKnownClick" Margin="0,0,30,0" Grid.Column="1" Height="60"/>

            <Button FontSize="{StaticResource RegularFontSize}" 
                Content="NEXT" 
                Grid.Column="2" HorizontalAlignment="Stretch" Background="{StaticResource aGray}" Foreground="{StaticResource aWhite}" BorderThickness="0" Grid.Row="2" Click="OnNextClick" Margin="30,0,0,0" Height="60"/>

            <Button HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}" BorderBrush="{StaticResource aWhite}" Foreground="{x:Null}" Margin="0" BorderThickness="0" Grid.ColumnSpan="2" Grid.Row="2" Click="OnSoundClick" Grid.Column="1">
                <Grid>
                    <Ellipse Width="80" Height="80" Fill="{StaticResource aSpecialGreen}" Stroke="{StaticResource aWhite}" StrokeThickness="2" />
                    <Path Data="M45.785,11.7429 L46.3516,12.4639 C50.3028,17.7472 52.6426,24.3056 52.6426,31.4104 C52.6426,38.5153 50.3028,45.0737 46.3516,50.357 L45.8892,50.9453 L45.3335,50.5875 L45.7022,50.1084 C49.5419,44.8686 51.8092,38.4043 51.8092,31.4104 C51.8092,24.4166 49.5419,17.9523 45.7022,12.7125 L45.222,12.0885 z M56.0789,5.42462 L56.4621,5.78709 C62.8355,12.1132 66.8368,21.2393 66.8368,31.386 C66.8368,41.5326 62.8355,50.6587 56.4621,56.9848 L55.9783,57.4423 L55.4785,57.1205 L55.9257,56.6862 C62.1262,50.3732 66.0034,41.3741 66.0034,31.386 C66.0034,21.3979 62.1262,12.3987 55.9257,6.08571 L55.5679,5.73824 z M37.0028,0.225001 L37.085,63.743 L15.8889,43.846 L0.151081,43.4224 L0,20.0173 L15.9958,19.822 z M64.9168,0 L65.2925,0.291739 C73.7158,7.00574 79.254,18.3758 79.254,31.2721 C79.254,44.4906 73.4355,56.1057 64.6553,62.7469 L64.4503,62.898 L64.0003,62.6082 L64.2314,62.432 C72.7825,55.7423 78.4206,44.284 78.4206,31.2721 C78.4206,18.5773 73.0542,7.36147 64.8518,0.609881 L64.4494,0.286886 z" Fill="{StaticResource aWhite}" HorizontalAlignment="Center" Height="45" Stretch="Fill" StrokeThickness="0" UseLayoutRounding="False" VerticalAlignment="Center" Width="45"/>
                </Grid>
            </Button>

        </Grid>

        <Grid Background="{StaticResource aWhite}" Visibility="{Binding IsKnownHitVisible,Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter=true}">
            <TextBlock Text="All are known!" Foreground="{StaticResource aRed}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="32"/>
        </Grid>
    </Grid>
</Page>
